<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>开通会员卡</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="__STATIC_URL__/static/mobile/css/weui.css"/>
    <script src="__STATIC_URL__/static/js/jquery-2.1.4.min.js"></script>
    <script src="__STATIC_URL__/static/mobile/js/weui.min.js" type="text/javascript" charset="utf-8"></script>

    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

</head>
<style type="text/css">
    body {
        background: #EBEBEB;
    }

    .weui-cells {
        margin-top: 6px;

    }

    .weui-cell_access .weui-cell__ft:after {
        border: none;
    }

    .button-box {
        margin-top: 50px;
        padding: 50px 50px 20px 50px;;
    }

    .content {
        padding: 20px;
    }
</style>
<body>

<div class="container" id="container">
    <div class="page badge js_show">
        <div class="page__bd">
            <div class="weui-cells">
                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__bd">即将开通</div>
                    <div class="weui-cell__ft" style="font-size: 0">
                        <span style="vertical-align:middle; font-size: 17px;">{$cardsinfo['brand_name'].$cardsinfo['title']}</span>
                    </div>
                </div>
            </div>
            <div class="weui-cells">
                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__bd">有效期</div>
                    <div class="weui-cell__ft" style="font-size: 0">
                        <span style="vertical-align:middle; font-size: 17px;">永久有效</span>
                    </div>
                </div>
            </div>
            <div class="weui-cells">
                <div class="weui-cell weui-cell_access">
                    <div class="weui-cell__bd">应付金额</div>
                    <div class="weui-cell__ft" style="font-size: 0">
                        <span style="vertical-align:middle; font-size: 17px;font-weight: 500; color: #ef0000;">{$cardsinfo['price']}</span>
                    </div>
                </div>
            </div>

            <div class="button-box">
                <button class="weui-btn weui-btn_primary" href="">立即购买</button>
            </div>
            <div class="content">
                <p style="font-weight:bold;font-size: 14px;"> 提示：</p>
                <div style="color: #525252;">{$cardsinfo['pay_profiles']}
                </div>
            </div> 
        </div>
    </div>
</div>

</body>

<script type="text/javascript">

    $(function () {



        $(".weui-btn_primary").click(function () {


            if (typeof WeixinJSBridge == "undefined") {
                if (document.addEventListener) {
                    document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
                } else if (document.attachEvent) {
                    document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
                    document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
                }
            } else {
                onBridgeReady({$jsApiObj});
            }


        })

        function onBridgeReady(sdata) {

            WeixinJSBridge.invoke(
                'getBrandWCPayRequest', sdata,
                function (res) {
                // alert(res.err_msg);
                    if (res.err_msg == "get_brand_wcpay_request:ok") {

                        paysuccess();
                    }    // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。
                    else if(res.err_msg == "get_brand_wcpay_request:fail"){
                        onBridgeReady({$jsApiObj});
                    }
                }
            );

        };

        function paysuccess() {


            $.ajax({
                type: "POST",

                url: "{:url('Cardshop/paysuccess')}",

                cache: false,
                dataType: "json",
                async: false,
                data: {
                    id: "{$cardsinfo['mid']}",
                    orderid: "{$cardsinfo['orderid']}",
                    // cardid: $('#cardid').val(),
                },

                success: function (data) {

                    if (data.code == 0) {

                        $(".ku").html("支付成功！");
                        $("#iosDialog3").fadeIn(200);
                        var url="{:url('carduser/opencard',array('card_id'=>request()->param('card_id')))}";
                        setTimeout(function(){ window.location.replace(url); },400)



                    } else {

                        $(".ku").html("支付失败！");
                        $("#iosDialog3").fadeIn(200);
                    }
                }


            });
        }
    })
</script>
</html>